<template>
	<view class="">
    <view class="flex flex-column align-end">
    	<view class="flex align-center u-p-y-10">
    		<text class="u-m-r-30 u-p-y-10">共计{{item.goods.length}}件</text>
    		<text class="u-font-30 u-m-r-5">合计</text>
    		<text class="u-font-30 text-danger"> ¥{{item.pay_price}}</text>
    	</view>
    </view>
		<view class="flex align-center justify-end text-center">
			<dy-button width="140rpx" backgroundColor="#fff" color="#333" borderColor="#C2C5C8" @click="show = true">取消订单</dy-button>
			<dy-button class="u-m-l-30" width="140rpx" @click="pay">支付</dy-button>
			<dy-button class="u-m-l-30" width="140rpx" @click="toOrderDetail">查看详情</dy-button>
			<u-modal v-model="show" content="确定取消订单吗?" :showCancelButton="true" @cancel="show = false" @confirm="confirm"></u-modal>
		</view>
	</view>
</template>

<script>
	import { OrderCenterApi } from '@/api/serves.js'
	export default {
		name:"order-item-waitpay",
		props: {
			item: {
				type: Object,
				default() {
					return {}
				}
			}
		},
		data() {
			return {
				show: false
			}
		},
		methods: {
			confirm() {
				this.$ShowLoading()
				OrderCenterApi.cancel_order({ id: this.item.id }).then(res => {
					this.$HideLoading()
				  console.log('取消订单', res);
					this.$Toast(res.msg)
					if(res.code == 1){
						uni.$emit('orderClick')
					}
				})
			},
			toOrderDetail() {
				uni.navigateTo({
					url: '/pages/order/mineOrderDetail/mineOrderDetail?order_no=' + this.item.order_no
				})
			},
			pay() {
        let params = {
          order_no: this.item.order_no,
          from: 'common'
        }
				uni.navigateTo({
					url: '/pages/goodsDetail/goodsOrderPay/goodsOrderPay?orderInfo=' + JSON.stringify(params)
				})
			}
			
		}
		
	}
</script>

<style scoped lang="scss">
</style>
